<template>
  <span class="money" v-html="format_money(value)"></span>
</template>

<script setup lang="ts">

const props = defineProps({
	value: {
		type: String,
		default: "",
	},
});

const emits = defineEmits(["update:modelValue", 'change']);

function format_money(money: any) {
	try{
	  if (!(typeof +money === 'number' && !isNaN(money))) {
		  money = 0
	  }
	  const strMoney = (+money).toFixed(2) + ''
	  const splitMoney = (strMoney + '').replace(/\B(?=(\d{3})+(?!\d))/g, ',').split('.')
	  if (splitMoney.length > 1) {
		  return `${splitMoney[0]}.<span style="font-size:12px;display: contents;">${splitMoney[1]}</span>`;
	  }else{
		  return `${splitMoney[0]}`;
	  }
	}catch {
		return 0
	}

}

onMounted(() => {

});
</script>
<style lang="scss" scoped>
.money{
  font-weight: bold;color: red;
}
</style>

